<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>添加用户</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../static/layuiadmin/layui/css/layui.css" media="all">
    <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
    <script src="../../static/jslib/jquery.validate.js" src="@{/jslib/jquery.validate.js}"></script>
    <script src="../../static/layuiadmin/layui/layui.js"></script>

    <script>
        layui.use(['form', 'layer'], function () {
            var form = layui.form
                , disable = false
                , layer = layui.layer

            $("#userAccount").blur(function () {
                var userAccount = $("#userAccount").val();
                var reg = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;//正则表达式
                if (userAccount.length < 6 || userAccount.length > 12) {
                    layer.msg('账号只能在6-12位', {icon: 5, time: 1000});
                } else {
                    if (!reg.test(userAccount)) {
                        layer.msg('账号必须字母开头！！！', {icon: 5, time: 1000});
                    }
                }
            });

            $("#email").blur(function () {
                var email = $("#email").val();
                var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
                if (!reg.test(email)) {
                    layer.msg('邮箱不合法！！！', {icon: 5, time: 1000});
                }
            });

            $("#mobile").blur(function () {
                var mobile = $("#mobile").val();
                var reg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
                if (!reg.test(mobile)) {
                    layer.msg('手机号码不合法！！！', {icon: 5, time: 1000});
                }
            });

            form.on('submit(demo1)', function (data) {
                var userAccount = data.field.userAccount
                    , mobile = data.field.mobile
                    , email = data.field.email

                var reg1 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;
                if (userAccount.length < 6 || userAccount.length > 12) {
                    layer.msg('账号只能在6-12位', {icon: 5, time: 1000});
                    return false;
                } else {
                    if (!reg1.test(userAccount)) {
                        layer.msg('账号必须字母开头！！！', {icon: 5, time: 1000});
                        return false;
                    }
                }
                var reg2 = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
                if (!reg2.test(email)) {
                    layer.msg('请输入有效的邮箱！', {icon: 2});
                    return false;
                }

                var reg3 = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
                if (!reg3.test(mobile)) {
                    layer.msg('请输入有效的手机号码！', {icon: 2});
                    return false;
                }
                event.preventDefault();
                if (disable) return
                disable = true
                    $.ajax({
                        type: "POST",
                        url: "/ams-admin/admin/save",
                        data: JSON.stringify(data.field),
                        contentType: "application/json",
                        success: function (r) {
                            disable = false
                            if (r.code === 0) {
                                layer.msg("添加成功！",{icon: 5, time: 1000})
                                window.parent.location.reload()
                                parent.layer.close(index)
                            } else {
                                layer.msg(r.message,{icon: 2,time:1000});
                            }
                        }
                    });
            })
        });

    </script>
</head>
<body>
<form class="layui-form" id="frm1" lay-filter="example">

    <div class="layui-form" lay-filter="layuiadmin-form-useradmin" id="layuiadmin-form-useradmin"
         style="padding: 20px;">


        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">用户名<i style="color: red">*</i></label>
                <div class="layui-input-inline">
                    <input type="text" id="username" name="username" lay-verify="required" placeholder="请输入用户名"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
            <input type="hidden" id="user_id" name="userId" autocomplete="off" class="layui-input" width="100">
            <div class="layui-inline">
                <label class="layui-form-label">用户账号<i style="color: red">*</i></label>
                <div class="layui-input-inline">
                    <input type="text" id="userAccount" name="userAccount" lay-verify="required" placeholder="请输入账号"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">用户部门<i style="color: red">*</i></label>
                <div class="layui-input-inline">
                    <select name="deptId" id="deptId" lay-verify="required">
                        <option value="">请选择</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">手机号码<i style="color: red">*</i></label>
                <div class="layui-input-inline">
                    <input type="text" id="mobile" name="mobile" lay-verify="required" placeholder="请输入号码" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">出生日期<i style="color: red">*</i></label>
                <div class="layui-input-inline">
                    <input type="date" id="birth" name="birth" lay-verify="required" placeholder="请输入用户生日" autocomplete="off"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">性别<i style="color: red">*</i></label>
                <div class="layui-input-inline" >
                    <select name="sex" lay-reqtext="请选择性别！" id="sex" lay-verify="required" lay-search="" >
                        <option value="请选择性别">请选择性别</option>
                        <option value="M">男</option>
                        <option value="F">女</option>
                    </select>
                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">邮箱<i style="color: red">*</i></label>
                <div class="layui-input-inline">
                    <input type="email" id="email" name="email" lay-verify="required" placeholder="请输入邮箱"
                           autocomplete="off"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">地址<i style="color: red">*</i></label>
                <div class="layui-input-inline">
                    <input type="text" id="address" name="address" lay-verify="required" placeholder="请输入用户地址"
                           autocomplete="off"
                           class="layui-input">
                </div>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-inline">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </div>

    </div>
    <script>

        $.get("/ams-admin/dept/findAll01", {}, function (data) {
            var list = data;
            var select = document.getElementById('deptId');
            if (list != null || list.size() > 0) {
                for (var c in list) {
                    var option = document.createElement("option");
                    option.setAttribute("value", list[c].deptId);
                    option.innerText = list[c].name;
                    select.appendChild(option)
                }
            }
            layui.form.render('select');
        }, "json");
    </script>
</form>
</body>
</html>
